<template>
  <div id="adminInfo">
    <!--公告卡片-->
    <el-card class="box-card">
      <div slot="header" class="clearfix">
        <div>
          <i class="el-icon-s-flag"></i>
          <span> 公告</span>
        </div>
      </div>
      <div style="float: left;">
        <div v-for="o in this.announcementList" :key="o" style="height: 50px;">
          <span style="font-size: 13px;color: #909399">{{ o.time }}</span>
          <span style="margin-left: 10px;color: #333333">{{ o.content }}</span>
        </div>
      </div>
    </el-card>
    <!--积分排行-->
    <el-card class="box-card" style="margin-top: 10px">
      <div slot="header" class="clearfix">
        <div>
          <i class="el-icon-trophy"></i>
          <span> 获赞榜单</span>
          <el-button type="text" style="float:right" @click="needLogin">更多..</el-button>
        </div>
      </div>
      <div>
        <table>
          <div v-for="(o,n) in this.commentLikeMaxList" :key="o"  style="height: 50px;">
            <tr>
              <td style="width: 30px">
                <div>
                  <i class="el-icon-trophy-1" v-if="n+1==1"></i><i class="el-icon-medal" v-if="n+1!=1"></i><span style="font-size: 10px">{{n+1}}</span>
                </div>
              </td>
              <td><el-avatar :size="35" :src="iconUrl+o.icon" @error="errorHandler" style=""></el-avatar></td>
              <td style="text-align: center"><div style="margin-left: 5px;"><span style="font-size: 8px">{{ o.nickName }}</span></div></td>
            </tr>
          </div>
        </table>
      </div>
    </el-card>
    <!--站长信息-->
    <el-card class="webmaster" style="margin-top: 10px">
      <div slot="header" class="clearfix">
        <div>
          <i class="el-icon-user-solid"> 站长</i>:
        </div>
        <div style="float: left;margin-left: 70px;margin-top: -30px">
          <el-avatar :size="35" :src="this.iconUrl+this.webAdmin.icon" @error="errorHandler"></el-avatar>
          <div style="float: right;margin-top: 8px;margin-left: 10px">
            <span style="font-size: 8px">{{ this.webAdmin.nickName }}</span>
          </div>
        </div>

      </div>
      <div>
        <div>
          <span style="font-size: 14px">{{ this.webAdmin.introduction }}</span>
        </div>
      </div>
    </el-card>
  </div>
</template>

<script>


export default {
  name: "AdminInfo",
  data() {
    return {
      iconUrl: this.$IconUrl, //头像地址根路径（全局变量）
      webAdmin: {
        age: '',
        id: '',
        introduction: '',
        isWebAdmin: '',
        nickName: '',
        icon: ''
      },
      announcementList: [{ //公告信息列表
        id: '', content: '', time: ''
      }],
      commentLikeMaxList: [{
        score: '', id: '', nickName: '', icon: ''
      }]
    }
  },
  methods: {
    //获取站长信息
    getWebAdminInfo() {
      this.$myAxios("/lastIndex/getWebAdminJ", 'get', null, resp => {
        console.log(resp)
        this.webAdmin = resp.data.data;
      })
    },
    //获取获赞榜单信息
    getCommentLikeMaxList() {
      this.$myAxios('/lastIndex/getCommentLikeMaxList', 'get', null, resp => {
        console.log(resp)
        this.commentLikeMaxList=resp.data.data
      })
    },
    //获取网站公告信息
    getAnnouncementList() {
      this.$myAxios("/lastIndex/getAnnouncementListJ", 'get', null, resp => {
        console.log(resp)
        this.announcementList = resp.data.data;
      })
    },
    //检验用户是否登录,如果返回的code的码为201那么就跳转到index界面(见request.js中写的逻辑）
    testIsLogin() {
      this.$axios.post("/lastIndex/testIsLoginJ", 'post', null).then(resp => {
        console.log(resp);
      })
    },
  },
  created() {
    //获取站长信息
    this.getWebAdminInfo()
    //获取网站公告
    this.getAnnouncementList();
    //获取赞数排行榜
    this.getCommentLikeMaxList();
    //检验用户是否登录
    //this.testIsLogin();
  }
}
</script>

<style scoped>
.box-card {
}
</style>